<template>
	<div class="search">

		<div class="search_top flex side_center">
			<div class="search_top_l flex start_center">
				<i class="iconfont iconsearch icon-search1"></i>
				<input v-model="key" class="search_top_ipt" type="" name="" placeholder="请输入车型">
			</div>
			<button class="search_top_r" @click="getInfo">搜索</button>
		</div>

		 <div style="display: flex;flex-direction: row; padding: 0.3rem" >
		   	    
		   	    <p style="margin-top: 0.5rem; margin-left: 0.5rem; font-size: 1.1rem ">卡罗拉</p>
		  </div>

		
	</div>
</template>

<script>
import axios from 'axios'
import global from '../../../utils/global'
import store from '../../../utils/store'
export default {
  name: 'Search',
  data () {
    return {
      
    }
  },
 
  mounted(){
  	
  },
  methods:{
    // 查看小伙伴详情
    toPartner(uuid,key){
      this.$router.push({
        name:'Partner',
        params: {
          uuid: uuid,
          key: key,
        }
      })
    },
    
    // 获取信息
    getInfo(){
      var that = this;
      axios.all([
        axios.get(global.api.index.search,{  //搜索
          params: {
            uuid: localStorage.getItem('carWashUuid'),
            key: that.key,
          }
        }),
        axios.get(global.api.carMine.car,{  //车子数量
          params: {
            uuid: localStorage.getItem('carWashUuid'),
          }
        }),
        axios.get(global.api.address.myAddress,{  //地址数量
          params: {
            uuid: localStorage.getItem('carWashUuid'),
          }
        }),
      ])
      .then(axios.spread(function(content,car,addr){
        console.log("getInfo then");
        console.log(content.data.data);
        console.log(car.data.data.length);
        console.log(addr.data.data.length);
        that.list = content.data.data;
        that.carLength = car.data.data.length;
        that.addrLength = addr.data.data.length;
      }))
      .catch(function(res){
        console.log(res);
      })
    }, 
  },
}
</script>

<style scoped>
	button:focus{
		outline-offset: 0px;
		outline: -webkit-focus-ring-color auto 0px;
	}
  /* 搜索 */
	.search{

	}
	.search_top{
		padding: 0.5rem 1rem;
		border-bottom: 1px solid #B3B3B4;
	}
	.search_top_l{
		-webkit-box-flex: 1;
    -webkit-flex: 1;
    flex: 1;
    background-color: #DDDDDD;
    height: 2rem;
    /*line-height: 2rem;*/
    border-radius: 1rem;
    padding-left: 0.5rem;
    justify-content: flex-start;
    align-items: center;
	}
	.iconsearch{
		font-size: 1.2rem;
		margin-right: 0.3rem;
	}
	.search_top_ipt{
		margin: 0;
		padding: 0;
		border: none;
		height: 2rem;
		background-color: #DDDDDD;
		font-size: 0.9rem;
	}
	.search_top_ipt:focus{
		outline-offset: 0px;
		outline: -webkit-focus-ring-color auto 0px;
	}
	.search_top_r{
		margin: 0;
		padding: 0;
		width: 4rem;
		height: 2rem;
		border: none;
		background-color: #fff;
		font-size: 1rem;
	}
	
</style>
<style>
	ul,li,div,a,p,span{
		margin: 0;
		padding: 0;
	}
	li{
		list-style: none;
	}
	.flex{
		display: -webkit-box;
    display: -webkit-flex;
    display: flex;
	}
	.side_center{
		justify-content: space-between;
		align-items: center
	}
	.start_center{
		justify-content: flex-start;
		align-items:center;
	}
	.start_end{
		justify-content: flex-start;
		align-items: flex-end;
	}
</style>
